<template>
  <cs-container>
    <page-header
      slot="header"
      :loading="loading"
      :shopType="shopType"
      @submit="handleSubmit"
      ref="header"/>

    <page-main
      :loading="loading"
      :table-data="table"
      :order-total="total"
      :tabActive = "tabActiveIndex"
      @tabs="handleTabs"
      @refresh="handleRefresh"
      @total="handleTotal"/>

    <page-footer
      slot="footer"
      :loading="loading"
      :current="page.current"
      :size="page.size"
      :total="page.total"
      @change="handlePaginationChange"/>
  </cs-container>
</template>

<script>
import { getShopList } from '@/api/shop/shop'
export default {
  name: 'setting-index',
  components: {
    PageHeader: () => import('./components/PageHeader'),
    PageMain: () => import('./components/PageMain'),
    PageFooter: () => import('@/components/cs-footer')
  },
  data() {
    return {
      loading: false,
      table: [],
      shopType: {
        1: '个人用户',
        2: '企业用户',
      },
      tabActiveIndex: 0,
      review_status: '',
      total: {},
      page: {
        current: 1,
        size: 10,
        total: 0
      }
    }
  },
  created() {
    this.handleSubmit()
  },
  methods: {
    // 刷新列表页面
    handleRefresh(isTurning = false) {
      if (isTurning) {
        !(this.page.current - 1) || this.page.current--
      }

      this.$nextTick(() => {
        this.$refs.header.handleFormSubmit()
      })
    },
    // 分页变化改动
    handlePaginationChange(val) {
      this.page = val
      this.$nextTick(() => {
        this.$refs.header.handleFormSubmit()
      })
    },
    // 标签页切换
    handleTabs(val) {
      this.tabActiveIndex = val
      this.review_status = val
      this.$nextTick(() => {
        this.$refs.header.handleFormSubmit(true)
      })
    },
    // 统计标签数量
    handleTotal(form) {
      getOrderStatusTotal(form)
        .then(res => {
          this.total = res.data || {}
        })
    },
    // 提交查询请求
    handleSubmit(form) {
      this.loading = true
      getShopList({...form,
        page_no: this.page.current,
        page_size: this.page.size,
        review_status: this.review_status
      }).then(res => {
          this.table = res.data.items || []
          this.page.total = res.data.total_result
      }).finally(() => {
          this.loading = false
      })
    },

  }

}
</script>
